﻿import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import my.TableModel 1.0
Window {
//    function max(x,y){
//        return x>y?x:y
//    }

    id: root
    width: tm.cols*51+tb.width
    height: Math.max(tm.rows*51,tb.height)
    visible: true
    title: qsTr("基于搜索技术的迷宫寻路系统")
    property int editMap: c1.currentIndex

    Background { // a dark background
        id: background
    }

    signal sigXY(int x,int y)
    Component {
        id: text1
        Text { text: txt}
    }
    Component {
        id: arrow
        Text {
            text: txt
            font.bold: true
            color: "grey"
            font.pointSize: 16
        }
    }

    TableView {
        objectName: "tableModel"
        anchors.fill: parent
        columnSpacing: 1
        rowSpacing: 1
        clip: true
//        Flickable.interactive: false

        model: TableModel {
            id:tm
        }

        delegate: Rectangle {
            id:rec1
            color: model.color1
            border.color: "#f3ffee"
            implicitWidth: 50
            implicitHeight: 50
            Text {
                text: display
                visible: sw1.checked
            }
            Loader{
                //                active: model.state===1?false:true
                active: sw1.checked
                property string txt: "["+model.state+"]"
                sourceComponent: text1
                anchors.right: parent.right
                anchors.bottom: parent.bottom

            }
            Loader{
                active: model.output
                property string txt: model.text
                sourceComponent: text1
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.verticalCenter: parent.verticalCenter

            }
            Loader{
                id:l2
                active: model.output && model.pre
                property string txt
                sourceComponent: arrow
                //                anchors.right: parent.right
                //                anchors.bottom: parent.bottom
                state: model.pre.toString()
                states: [//↑ ↓ ← → ↖ ↗ ↙ ↘
                    //anchors.horizontalCenter: parent.horizontalCenter
                    State {
                        name: "0"
                        PropertyChanges {
                            target: l2
                            txt:""
                            anchors.bottom : undefined
                            anchors.horizontalCenter : undefined
                            anchors.left : undefined
                            anchors.right : undefined
                            anchors.top : undefined
                            anchors.verticalCenter : undefined
                        }
                    },
                    State {
                        name: "1"
                        PropertyChanges {
                            target: l2
                            txt:"↖"
                            anchors.bottom : undefined
                            anchors.horizontalCenter : undefined
                            anchors.right : undefined
                            anchors.verticalCenter : undefined
                            anchors.left : parent.left
                            anchors.top : parent.top
                        }
                    },
                    State {
                        name: "2"
                        PropertyChanges {
                            target: l2
                            txt:"↑"
                            anchors.bottom : undefined
                            anchors.left : undefined
                            anchors.right : undefined
                            anchors.verticalCenter : undefined
                            anchors.horizontalCenter : parent.horizontalCenter
                            anchors.top : parent.top
                        }
                    },
                    State {
                        name: "3"
                        PropertyChanges {
                            target: l2
                            txt:"↗"
                            anchors.bottom : undefined
                            anchors.horizontalCenter : undefined
                            anchors.left : undefined
                            anchors.verticalCenter : undefined
                            anchors.top : parent.top
                            anchors.right: parent.right
                        }
                    },
                    State {
                        name: "4"
                        PropertyChanges {
                            target: l2
                            txt:"←"
                            anchors.bottom : undefined
                            anchors.horizontalCenter : undefined
                            anchors.right : undefined
                            anchors.top : undefined
                            anchors.verticalCenter: parent.verticalCenter
                            anchors.left : parent.left
                        }
                    },
                    State {
                        name: "6"
                        PropertyChanges {
                            target: l2
                            txt:"→"
                            anchors.bottom : undefined
                            anchors.horizontalCenter : undefined
                            anchors.left : undefined
                            anchors.top : undefined
                            anchors.right: parent.right
                            anchors.verticalCenter: parent.verticalCenter
                        }
                    },
                    State {
                        name: "7"
                        PropertyChanges {
                            target: l2
                            txt:"↙"
                            anchors.horizontalCenter : undefined
                            anchors.right : undefined
                            anchors.top : undefined
                            anchors.verticalCenter : undefined
                            anchors.left : parent.left
                            anchors.bottom: parent.bottom
                        }
                    },
                    State {
                        name: "8"
                        PropertyChanges {
                            target: l2
                            txt:"↓"
                            anchors.left : undefined
                            anchors.right : undefined
                            anchors.top : undefined
                            anchors.verticalCenter : undefined
                            anchors.horizontalCenter : parent.horizontalCenter
                            anchors.bottom: parent.bottom
                        }
                    },
                    State {
                        name: "9"
                        PropertyChanges {
                            target: l2
                            txt:"↘"
                            anchors.horizontalCenter : undefined
                            anchors.left : undefined
                            anchors.top : undefined
                            anchors.verticalCenter : undefined
                            anchors.right: parent.right
                            anchors.bottom: parent.bottom
                        }
                    }
                ]

            }

            MouseArea {
                id: mouseArea
                anchors.fill: parent
                cursorShape: Qt.OpenHandCursor
                signal sigXY(int x,int y)
                function reuse(){console.log("reused:"+"("+X+","+Y+")");}
                acceptedButtons: Qt.LeftButton | Qt.RightButton

                Connections {
                    target: mouseArea
                    onClicked: {console.log("clicked:"+"("+X+","+Y+")");
                        model.state=root.editMap;
                        sigXY(X,Y)
                    }
                    TableView.onReused:mouseArea.reuse()
                }
            }
        }
    }

    //    Binding { target: root; property: "width"; value: tm.cols*10 }
    ToolBar {
        id:tb
        opacity: 0.8
        anchors.right: parent.right
        //        anchors.left: parent.left
//        anchors.bottom: parent.bottom
        anchors.rightMargin: -1
        property string ft1: "Microsoft YaHei"
        property int fts: 12
        //工具栏
        ColumnLayout{
//            Label {
//                text: "控件"+c1.currentIndex
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                elide: Label.ElideRight
//                horizontalAlignment: Qt.AlignHCenter
//                verticalAlignment: Qt.AlignVCenter
//                font.weight: Font.Light
//                Layout.fillWidth: true
//            }
            Label{
                text: "编辑迷宫"
                font.family: tb.ft1
                font.pointSize: tb.fts*1.5
                horizontalAlignment: Qt.AlignHCenter
                verticalAlignment: Qt.AlignVCenter
                font.weight: Font.Light
                Layout.fillWidth: true
                Layout.fillHeight: true
            }


//            Component{
//                id:tb1
//                Label{
//                    id:lb1
//                    text: "加载成功"
//                    font.family: tb.ft1
//                    font.pointSize: tb.fts
//                    //                    elide: Label.ElideRight
//                    //                    horizontalAlignment: Qt.AlignHCenter
//                    //                    verticalAlignment: Qt.AlignVCenter
//                    //                    font.weight: Font.Light
//                    //                    Layout.fillWidth: true
//                }
//            }
//            ToolButton{
//                text: "设置障碍"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=1}
//            }
//            ToolButton{
//                text: "清除障碍"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=0}
//            }
//            ToolButton{
//                text: "设置起点"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=2}
//            }
//            ToolButton{
//                text: "设置终点"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=3}
//            }
            ComboBox{
                id:c1
                font.family: tb.ft1
                font.pointSize: tb.fts
                model:["清除障碍","设置障碍","设置起点","设置终点"]
                currentIndex: 1
            }
//            ToolButton{
//                text: "设置障碍"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=1}
//            }
//            ToolButton{
//                text: "清除障碍"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=0}
//            }
//            ToolButton{
//                text: "设置起点"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=2}
//            }
//            ToolButton{
//                text: "设置终点"
//                font.family: tb.ft1
//                font.pointSize: tb.fts
//                onClicked: {root.editMap=3}
//            }
            ToolButton{
                text: "清理迷宫"
                font.family: tb.ft1
                font.pointSize: tb.fts
                Layout.fillWidth: true
                onClicked: {tm.cleanMap()}
            }
            Label{
                text: "列数"
                font.family: tb.ft1
                font.pointSize: tb.fts
                horizontalAlignment: Qt.AlignHCenter
                verticalAlignment: Qt.AlignVCenter
                font.weight: Font.Light
                Layout.fillWidth: true
                Layout.fillHeight: true
            }
            SpinBox {
                id: cols
                value: 10
                editable:true
            }
            Label{
                text: "行数"
                font.family: tb.ft1
                font.pointSize: tb.fts
                horizontalAlignment: Qt.AlignHCenter
                verticalAlignment: Qt.AlignVCenter
                font.weight: Font.Light
                Layout.fillWidth: true
                Layout.fillHeight: true
            }
            SpinBox {
                id: rows
                value: 10
                editable:true
            }
            ToolButton{
                text: "RESET 迷宫"
                font.family: tb.ft1
                font.pointSize: tb.fts
                Layout.fillWidth: true
                onClicked: {tm.resetAll(cols.value,rows.value)}
            }
            Label{
                text: "搜索"
                font.family: tb.ft1
                font.pointSize: tb.fts*1.5
                horizontalAlignment: Qt.AlignHCenter
                verticalAlignment: Qt.AlignVCenter
                font.weight: Font.Light
                Layout.fillWidth: true
                Layout.fillHeight: true
            }
            ComboBox{
                id:cs
                font.family: tb.ft1
                font.pointSize: tb.fts
                model:["A*搜索","DFS深度优先","BFS宽度优先","贪婪搜索","等代价搜索"]
                currentIndex: 1
            }
            ComboBox{
                id:cd
                font.family: tb.ft1
                font.pointSize: tb.fts
                model: ["欧氏距离","曼哈顿距离","切比雪夫距离"]
            }

            ToolButton{
                text: "单步搜索"
                font.family: tb.ft1
                font.pointSize: tb.fts
                Layout.fillWidth: true
                onClicked: {tm.stepSearch(cs.currentIndex,cd.currentIndex)}
            }
            ToolButton{
                text: "自动搜索"
                font.family: tb.ft1
                font.pointSize: tb.fts
                Layout.fillWidth: true
                onClicked: {tm.autoSearch(cs.currentIndex,cd.currentIndex)}
            }
            ToolButton{
                text: "清理搜索"
                font.family: tb.ft1
                font.pointSize: tb.fts
                Layout.fillWidth: true
                onClicked: {tm.resetSearch()}
            }
//            Label{
//                text: ""
//                font.family: tb.ft1
//                font.pointSize: tb.fts*1.5
//                horizontalAlignment: Qt.AlignHCenter
//                verticalAlignment: Qt.AlignVCenter
//                font.weight: Font.Light
//                Layout.fillWidth: true
//                Layout.fillHeight: true
//            }
            Component{
                id:done
                Label{
                    text: "搜索完成！"
                    font.family: tb.ft1
                    font.pointSize: tb.fts*1.8
                    horizontalAlignment: Qt.AlignHCenter
                    verticalAlignment: Qt.AlignVCenter
    //                font.weight: Font.Light
                    Layout.fillWidth: true
                    Layout.fillHeight: true
                }
            }



            Switch{
                id:sw1
                text: "显示坐标"
                //                checked:true
            }

//            ToolButton{
//                text: loader.status == Loader.Ready ? 'Loaded' : 'Not loaded'
//                onClicked: {
//                    //                    tm.testData();
//                    loader.active=false
//                }
//                Loader{
//                    id:loader
//                    //active: false
//                    //anchors.fill: parent
//                    sourceComponent: tb1

//                    onActiveChanged: console.log("ActiveChanged")
//                }
//                Component.onCompleted: {
//                    console.log("Component.onCompleted"+tm.cols)
//                    //                    loader.setSource(tb1)
//                    //                    root.width:{return tm.columnCount()}
//                    //                    root.width=Qt.binding(function(){return tm.cols*50+10})
//                }

//            }

        }
    }

}
